<template>
  <div class="home">
    <Header />
    <el-container>
      <el-aside class="container">
        <Menu />
      </el-aside>
      <el-main class="mains">
        <span class="Breadcrumb">
          <Tips />
        </span>
        <router-view></router-view>
      </el-main>
    </el-container>
  </div>
</template>

 
<script setup>
import { ref } from 'vue'
import Header from '../components/head.vue'
import Footer from '../components/footer.vue'
import Menu from '../layout/components/Menu/index.vue'
import Tips from '@/components/Tips'
</script>

<style lang="less" scoped>
.container {
  background: #304156;
  height: calc(100vh - 60px) !important;
  overflow: hidden;
  z-index: 2;
  .Breadcrumb {
    position: absolute;
    top: 60px;
    width: 100%;
    display: inline-block;
    margin-left: 30px;
    line-height: 60px;
  }
}
.el-main {
  --el-main-padding: 0px;
}
.mains {
  height: 90vh;
  overflow-y: scroll;
}
</style>
